// 导航菜单切换
document.addEventListener('DOMContentLoaded', function() {
  const menuToggle = document.getElementById('menu-toggle');
  const sidebar = document.querySelector('aside');
  const sidebarOverlay = document.getElementById('sidebar-overlay');
  
  // 移动端侧边栏切换
  menuToggle.addEventListener('click', () => {
    sidebar.classList.toggle('hidden');
    sidebar.classList.toggle('absolute');
    sidebar.classList.toggle('top-0');
    sidebar.classList.toggle('left-0');
    sidebar.classList.toggle('h-full');
    sidebarOverlay.classList.toggle('hidden');
  });
  
  sidebarOverlay.addEventListener('click', () => {
    sidebar.classList.add('hidden');
    sidebarOverlay.classList.add('hidden');
  });
  
  // 更新当前时间
  function updateTime() {
    const now = new Date();
    const timeString = now.toLocaleString('zh-CN', {
      year: 'numeric',
      month: '2-digit',
      day: '2-digit',
      hour: '2-digit',
      minute: '2-digit',
      second: '2-digit',
      hour12: false
    }).replace(',', '');
    
    document.getElementById('current-time').textContent = timeString;
    document.getElementById('current-time-gate').textContent = timeString;
    document.getElementById('current-time-robot').textContent = timeString;
    document.getElementById('current-time-settings').textContent = timeString;
  }
  
  // 初始化时间并每秒更新
  updateTime();
  setInterval(updateTime, 1000);
  
  // 初始化图表（仅在机器人页面）
  if (!document.getElementById('robot').classList.contains('hidden')) {
    initCharts();
  }
});

// 初始化图表
function initCharts() {
  // 任务完成情况图表
  const taskCtx = document.getElementById('taskChart').getContext('2d');
  new Chart(taskCtx, {
    type: 'bar',
    data: {
      labels: ['清洁A1', '清洁A2', '配送B1', '配送B3', '安防S1', '安防S2'],
      datasets: [{
        label: '已完成任务',
        data: [12, 8, 15, 7, 20, 5],
        backgroundColor: '#165DFF',
      }, {
        label: '未完成任务',
        data: [3, 5, 2, 8, 0, 10],
        backgroundColor: '#E5E7EB',
      }]
    },
    options: {
      responsive: true,
      maintainAspectRatio: false,
      scales: {
        x: { stacked: true },
        y: { stacked: true, beginAtZero: true }
      }
    }
  });
  
  // 状态分布图表
  const statusCtx = document.getElementById('statusChart').getContext('2d');
  new Chart(statusCtx, {
    type: 'doughnut',
    data: {
      labels: ['工作中', '待命', '充电中', '故障'],
      datasets: [{
        data:  [45, 20, 25, 10],
        backgroundColor: [
          '#52C41A',
          '#165DFF',
          '#FAAD14',
          '#FF4D4F'
        ]
      }]
    },
    options: {
      responsive: true,
      maintainAspectRatio: false,
      plugins: {
        legend: {
          position: 'bottom'
        }
      }
    }
  });
}